<template>
  <UniPopup ref="set" background-color="#fff" @change="change">
    <view class="options">
      <template v-for="(v, i) in setOptions" :key="i">
        <template
          v-if="v.text === '会员证' && (memberValue?.memberState === 0 || !memberValue?.leaderId)"
        ></template>
        <view v-else class="set-option" @click="handleClick(v)">{{ v.text }}</view>
      </template>
    </view>
    <view class="division"></view>
    <view class="set-option" @click="close">取消</view>
  </UniPopup>
</template>

<script lang="ts" setup>
  import type { IMemberManageListResData } from '@/api/admin/types';
  import { navigateTo } from '@/router';
  import { propTypes } from '@/utils/propTypes';
  import { getCurrentInstance, type PropType, ref, watch } from 'vue';
  import UniPopup from '../../../../uni_modules/uni-popup/components/uni-popup/uni-popup.vue';
  import { Toast } from '@/utils';

  const props = defineProps({
    modelValue: propTypes.bool.def(false),
    memberValue: {
      type: Object as PropType<IMemberManageListResData>,
      required: true,
    },
  });

  const emit = defineEmits(['update:modelValue', 'close']);

  const setOptions = ref([
    {
      text: '续费设置',
      fnc: () =>
        navigateTo({
          name: 'memberRenewSet',
          options: {
            id: props.memberValue.memberId,
            memberName: props.memberValue.memberName,
            levelName: props.memberValue.levelName,
            levelId: props.memberValue.levelId,
            applyType: props.memberValue.applyType,
          },
        }),
    },
    {
      text: '会员设置',
      fnc: () => navigateTo({ name: 'memberSet', options: { id: props.memberValue?.memberId } }),
    },
    // {
    //   text: '同步会员信息至名片',
    //   fnc: () => {
    //     uni.showModal({
    //       title: '同步会员信息至名片',
    //       content: '确认同步后,会员资料将覆盖已有单位和个人名片信息,请谨慎操作.',
    //       success: ({ confirm }) => {
    //         if (confirm && props.memberValue) {
    //           const { memberId, leaderId } = props.memberValue;
    //           cardInfoSync(memberId, leaderId).then(() => Toast('同步成功', 'none', 1500));
    //         }
    //       },
    //     });
    //   },
    // },
    {
      text: '会员证',
      fnc: () =>
        props.memberValue?.memberId &&
        navigateTo({ name: 'membershipCard', options: { id: props.memberValue.memberId } }),
    },
    // {
    //   text: '个人名片',
    //   fnc: () => navigateTo('personCard', { id: props.memberValue?.leaderId }),
    // },
    {
      text: '查看单位主页',
      fnc: () => navigateTo({ name: 'businessCard', options: { id: props.memberValue?.memberCompanyId } }),
    },
    {
      text: '编辑单位主页',
      fnc: () => {
        const id = props.memberValue?.memberCompanyId;
        if (!id) return;
        navigateTo({
          name: 'adminEditBusinessCard',
          options: {
            id,
          },
        });
      },
    },
    {
      text: '入会信息',
      fnc: () =>
        props.memberValue?.memberId &&
        navigateTo({ name: 'adminMembershipInfo', options: { id: props.memberValue?.memberId } }),
    },
    {
      text: '人员信息',
      fnc: () =>
        navigateTo({
          name: 'personInfo',
          options: {
            id: props.memberValue?.memberId,
            applyType: props.memberValue?.applyType,
          },
        }),
    },
    {
      text: '缴费记录',
      fnc: () => navigateTo({ name: 'payInfo', options: { id: props.memberValue?.memberId } }),
    },
    {
      text: '查看工商信息',
      fnc: () => {
        if (!props.memberValue?.companyId) {
          Toast('该会员暂未绑定工商信息');
          return;
        }
        navigateTo({ name: 'businessInfo', options: { id: props.memberValue?.companyId } });
      },
    },
    {
      text: '查看补贴服务',
      fnc: () => {
        if (!props.memberValue?.companyName) {
          Toast('该会员未填写单位名称');
          return;
        }
        navigateTo({
          name: 'policyServiceReport',
          options: { name: props.memberValue?.companyName },
        });
      },
    },
    {
      text: '附件管理',
      fnc: () => {
        navigateTo({
          name: 'attachmentManager',
          options: { memberId: props.memberValue?.memberId },
        });
      },
    },
  ]);

  const handleClick = (v: { text: string; fnc: Function }) => {
    close();
    v.fnc();
  };

  watch(
    () => props.modelValue,
    (val) => (val ? open() : close()),
  );

  const _this = getCurrentInstance();
  const open = () => {
    (_this?.refs.set as any).open('bottom');
  };

  const close = () => {
    (_this?.refs.set as any).close('bottom');
  };

  function change(e: { show: boolean }) {
    emit('update:modelValue', e.show);
    !e.show && emit('close');
  }
</script>

<style lang="scss" scoped>
  .set-option {
    width: 100%;
    height: 88rpx;
    line-height: 88rpx;
    text-align: center;
    font-size: 28rpx;
    color: #333333;
    // border-bottom: 1rpx #DDDDDD solid;
  }

  .options {
    .set-option:not(:last-child) {
      // border-bottom: unset;
      border-bottom: 1rpx #dddddd solid;
    }
  }

  .division {
    height: 30rpx;
    background: #f5f5f5;
  }
</style>
